<template>
  <view class="my tabbar-page-bottom">
    <view class="banner">
      <text class="qh-rt-single qh-rt-a-zu4457 my-top-bg-icon"></text>
      <view class="bannera">
        <view class="userinfo">
          <view @longtap="userAuth">
            <qh-image shape="circle" :src="info.avatar" size="100">
              <view slot="empty" class="empty-image flex-end-cn">
                <text class="qh-rt-single qh-rt-yuangong empty-image-icon"></text>
              </view>
            </qh-image>
          </view>
          <view class="mar_l_30">
            <view class="nickname" v-if="!isRegister" @tap="userAuth">点击登录</view>
            <view class="nickname" v-else-if="info.nickname">{{
              info.nickname
            }}</view>
            <view v-if="isRegister">
              <view v-if="info.plus_type == 2" class="plus-id">PLUS会员</view>
              <view v-if="info.plus_type == 3" class="vip-id">
                <image class="vip-iden"
                  src="https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1729071052670f87ccc170e.png">
                </image>
                <view class="vip-grade-name">{{ info.grade_name }}</view>
              </view>
            </view>
          </view>
        </view>
        <view @tap="seeMessage" class="newMessage">
          <text class="qh-rt-single qh-rt-a-zu4435 message-icon"></text>
          <view class="list-tip-text" v-if="info && info.unread_message > 0">{{
            info.unread_message
          }}</view>
        </view>
      </view>
      <view class="bannerb">
        <view class="bannerb_inner" @tap="toRecharge" :data-type="online_status">
          <view class="bannerb_inner_num">{{
            info.balance ? info.balance : "0.00"
          }}</view>
          <view class="bannerb_inner_name">
            福气值
            <block v-if="
              info.integral != null && info.is_vip == 1 && online_status == 1
            "></block>
            <!-- <block
              v-if="
                info.integral != null && info.is_vip == 1 && online_status == 1
              "
              >·充值</block> -->
          </view>
        </view>
        <!-- <view class="bannerb_inner" @tap="toIntegral">
          <view class="bannerb_inner_num">{{
            info.integral ? info.integral : "0"
          }}</view>
          <view class="bannerb_inner_name">{{ integral_name }}</view>
        </view> -->
        <view class="bannerb_inner" @tap="toCoupon">
          <view class="bannerb_inner_num">{{
            info.count ? info.count : 0
          }}</view>
          <view class="bannerb_inner_name">优惠券</view>
        </view>
        <view class="bannerb_inner" @tap="toGiftCard">
          <view class="bannerb_inner_num">{{
            info.gift_card_count ? info.gift_card_count : 0
          }}</view>
          <view class="bannerb_inner_name">礼品卡</view>
        </view>
      </view>
      <view v-if="isRegister" class="bannerc flex-spb-cn" @tap.stop="mycard">
        <view class="bannerc_inner_left">
          <image src="https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735374772676fb7b4dee47.png"></image>
          <text>会员专属</text>
        </view>
        <view class="bannerc_inner_right">
          <text v-if="info.integral != null && info.is_vip == 1">查看</text>
          <text v-else>去绑定</text>
        </view>
      </view>
      <view v-else class="bannerc flex-spb-cn" @tap.stop="userAuth">
        <view class="bannerc_inner_left">
          <image src="https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735374772676fb7b4dee47.png"></image>
          <text decode="decode">会员专属</text>
        </view>
        <view class="bannerc_inner_right"><text decode="decode">请登录</text></view>
      </view>
    </view>
    <view class="list">
      <view class="list-top">
        <text class="list-title">我的订单</text>
        <view class="list-right" @tap="toAllOrder" data-index="0">
          <text>全部订单</text>
          <image src="/static/images/arrow-right.png"></image>
        </view>
      </view>
      <view class="list-order-content">
        <view class="list-item" v-for="(item, index) in orderMenu" :key="index" @tap="toOrder(index)">
          <text class="qh-rt-single list-item-icon" :class="item.icon"></text>
          <text class="list-item-text">{{ item.name }}</text>
          <view class="list-tip-text" v-if="item.num != 0">{{ item.num }}</view>
        </view>
      </view>
    </view>
    <view class="list">
      <view class="list-top"><text class="list-title" @click="openDebug">常用功能</text></view>
      <view class="list-other-content">
        <block v-for="(item, index) in otherMenu" :key="index">
          <view v-if="
            (item.type == 4 && open_plus == 1) ||
            (item.type == 5 && info && info.is_vip) ||
            (item.type == 6 && gift) ||
            (item.type != 4 &&
              item.type != 5 &&
              item.type != 6 &&
              item.type != 8 &&
              item.type !== 10) ||
            (item.type == 8 && open_turntable_task) ||
            (item.type == 8 && open_distribution == 1) ||
            (item.type == 10 &&
              userInfo.store_id &&
              userInfo.store_id !== '0' &&
              !showAuth)
          " class="list-other-item" @tap="toOther" :data-type="item.type" :data-path="item.path">
            <text class="qh-rt-single list-other-item-icon" :class="item.icon" :style="item.bg + ' ' + fontBg"></text>
            <text class="list-other-item-text">{{ item.name }}</text>
          </view>
        </block>
      </view>
    </view>

    <!-- 供应商图片 -->
    <!-- <view class="list_supplier">
			<view class="list-other-content"  >
				<img @click="handlerToSupplier" style="height: 200rpx;width: 100%;" src="https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/Uploads/tempImage/66712f4b9d2441124.png" alt="">
			</view>
		</view> -->
    <!-- 返回按钮 -->
    <view v-show="showBack" class="back-before flex-cn" @tap="reBack" :style="backStyle">
      <text class="qh-rt-single qh-rt-zuo-zuo back-before-icon"></text>
      <!-- <image src="/static/images/arrow-left.png"></image> -->
      <text class="back-before-text">返回</text>
    </view>

    <!-- 登录、重新授权 -->
    <login-and-register type="1" ref="loginRef" @success="loginSuccess"></login-and-register>

    <view class="wyb-class">
      <wyb-modal ref="modal" :showTitle="false" confirm-text="保存二维码" :mask-alpha="0.4" custom width="500" height="750"
        cancel-text="关闭" @cancel="cancelModal" @confirm="onConfirmClick" class="wyb-modal-class">
        <view class="qr_class">
          <image :src="appletCode" mode=""></image>
          <view style="color: #333; line-height: 1.2">所属门店: {{ info.store_name }}</view>
        </view>
      </wyb-modal>
    </view>
  </view>
</template>

<script>
const App = getApp().globalData;
import wybModal from "@/components/wyb-modal/wyb-modal.vue";

import { base64src } from "@/utils/base64.js";
export default {
  components: {
    wybModal,
  },
  props: {
    type: {
      type: [String, Number],
      default: 1,
    },
  },
  data() {
    return {
      fontBg:
        ";-webkit-background-clip: text;-webkit-text-fill-color: transparent;",
      password: "",
      open_plus: 0,
      showAuth: false,
      canIUse: uni.canIUse("button.open-type.getUserInfo"),
      showBack: false, //是否显示返回上一页面的按钮
      open_turntable_task: false, //是否开启大转盘任务活动
      orderMenu: [
        {
          name: "待付款",
          path: `/pages/${this.type == 1 ? "mer/order/list/list" : "myOrder/myOrder"
            }?nav=-1`,
          icon: "qh-rt-a-zu4437",
          index: -1,
          num: 0,
          num_key: "wait_pay_num",
        },
        {
          name: "待发货/自取",
          path: `/pages/${this.type == 1 ? "mer/order/list/list" : "myOrder/myOrder"
            }?nav=2`,
          icon: "qh-rt-a-zu4438",
          index: 2,
          num: 0,
          num_key: "wait_delivery",
        },
        {
          name: "待收货",
          path: `/pages/${this.type == 1 ? "mer/order/list/list" : "myOrder/myOrder"
            }?nav=3`,
          icon: "qh-rt-a-zu4439",
          index: 3,
          num: 0,
          num_key: "wait_take",
        },
        {
          name: "已完成",
          path: `/pages/${this.type == 1 ? "mer/order/list/list" : "myOrder/myOrder"
            }?nav=4`,
          icon: "qh-rt-a-zu4440",
          index: 4,
          num: 0,
          num_key: "wait_evaluation",
        },
        {
          name: "售后",
          path: "/pages/order/service/service",
          icon: "qh-rt-a-zu4441",
          num: 0,
          num_key: "after_sales",
        },
      ],
      otherMenu: [
        {
          name: "我的拼团",
          path: `/pages/${this.type == 1 ? "mer/order/list/list" : "myOrder/myOrder"
            }?nav=1&genre=2`,
          icon: "qh-rt-a-zu4451",
          bg: "background:-webkit-linear-gradient(top, #FB9790 0%, #E3597D 100%)",
          type: 1,
        },
        {
          name: "我的秒杀",
          path: `/pages/${this.type == 1 ? "mer/order/list/list" : "myOrder/myOrder"
            }?nav=1&genre=3`,
          icon: "qh-rt-a-zu4449",
          bg: "background:-webkit-linear-gradient(top, #F6C954 0%, #F0964A 100%)",
          type: 2,
        },
        {
          name: "我的收藏",
          path: "/pages/mine/MyCollect/MyCollect",
          icon: "qh-rt-a-zu4448",
          bg: "background:-webkit-linear-gradient(top, #F5AD75 0%, #F55659 100%)",
          type: 3,
        },
        {
          name: "plus会员专享",
          path: "/pages/mine/plusHome/plusHome",
          icon: "qh-rt-a-zu4445",
          bg: "background:-webkit-linear-gradient(top, #F6C954 0%, #F0964A 100%)",
          type: 4,
        },
        {
          name: "次卡",
          path: "/pages/mine/subCard/subCard",
          icon: "qh-rt-a-zu4442",
          bg: "background:-webkit-linear-gradient(top, #FB9790 0%, #E3597D 100%)",
          type: 5,
        },
        {
          name: "购买卡",
          path: "/pages/mer/tabbar/gift_purchase/gift_purchase",
          icon: "qh-rt-a-zu4446",
          bg: "background:-webkit-linear-gradient(top, #87CDFF 0%, #3D8CEB 100%)",
          type: 6,
        },
        {
          name: "我的优惠券",
          path: "/pages/mine/mycoupon/mycoupon",
          icon: "qh-rt-a-zu4443",
          bg: "background:-webkit-linear-gradient(top, #85BDFF 0%, #7380F1 100%)",
          type: 7,
        },
        // #ifndef MP-ALIPAY
        {
          name: "分销中心",
          path: "/pages/distribution/center/center",  
          icon: "qh-rt-a-zu4444",
          bg: "background:-webkit-linear-gradient(top, #F6C954 0%, #F0964A 100%)",
          type: 8,
        },
        // #endif
        {
          name: "收货地址",
          path: "/pages/mine/MyAddress/MyAddress",
          icon: "qh-rt-a-zu4450",
          bg: "background:-webkit-linear-gradient(top, #FB9790 0%, #E3597D 100%)",
          type: 9,
        },
        // {
        //   name: "邀请入群",
        //   path: "/pages/mer/tabbar/invite/invite",
        //   icon: "feiIconfont icon-yaoqing3",
        //   bg: "background:-webkit-linear-gradient(top, #FB9790 0%, #E3597D 100%)",
        //   type: 11,
        // },
        // {
        //   name: "领券中心",
        //   path: "/pages/mer/tabbar/coupon/coupon?genre=" + 1,
        //   icon: "feiIconfont icon-lingquanzhongxin",
        //   bg: "background:-webkit-linear-gradient(top, #FB9790 0%, #E3597D 100%)",
        //   type: 12,
        // },
        {
          name: "客服",
          path: "/pages/mer/goods/details/contact",
          icon: "feiIconfont icon-kefu",
          bg: "background:-webkit-linear-gradient(top, #FB9790 0%, #E3597D 100%)",
          type: 13,
        },
        // {
        // 	name: '门店二维码',
        // 	path: '',
        // 	icon: 'qh-rt-a-zu4447',
        // 	bg: 'background:-webkit-linear-gradient(top, #87CDFF 0%, #3D8CEB 100%)',
        // 	type: 10
        // }
      ],
      isRegister: false,
      info: {
        avatar: "",
        nickname: "",
        plus_type: 1,
        grade_name: "",
        distributor: 0, // 是否是分销员(true)
        store_name: "",
        belong_store_id: "",
      },
      gift: 0,
      beforeUrl: "",
      online_status: null, //能否跳转到recharge
      isRecruit: "",
      open_distribution: 0, //1是开启 0是关闭
      beforePath: "",
      appletCode: "", // 门店二维码
      userInfo: {},
      loginCallbackAdr: "", //上一页
      debugCount: 0,
      lastTime: 0,
      qrCode: "",
      qrCodeOptions: {
        code: "",
        type: "dots",
      },
      integral_name: "",
    };
  },
  computed: {
    backStyle() {
      return `bottom:${this.$store.bottomHeight + 100 + 110}rpx`;
    },
  },
  methods: {
    //领券中心
    handlerCoupon() {
      uni.navigateTo({
        url: "/pages/mer/tabbar/coupon/coupon?genre=" + 1,
      });
    },

    async onLoads(options) {
      await this.$onLaunched;
      // #ifdef MP-ALIPAY
      if (JSON.stringify(options) == "{}") {
        options = my.getLaunchOptionsSync().query;
      }
      // #endif

      if (options && options.store_id) {
        this.$store.store_id = options.store_id;
      }
      if (options && options.beforePath) {
        this.beforePath = options.beforePath;
      }
      console.log("frontColor", this.$store.primaryBgTextColor);
      console.log("backgroundColor", this.$store.primaryBgColor);
      uni.setNavigationBarColor({
        // #ifdef MP-WEIXIN
        frontColor: this.$store.primaryBgTextColor,
        // #endif
        backgroundColor: this.$store.primaryBgColor,
      });
    },
    async onShows() {
      await this.$onLaunched;
      App.resetStoreId();
      this.integral_name = this.$store.integral_name;
      var beforeUrl = uni.getStorageSync("loginCallbackAdr");
      this.setData({
        showBack: beforeUrl ? true : false,
        loginCallbackAdr: beforeUrl ? beforeUrl : "",
      });
      if (beforeUrl) {
        uni.removeStorageSync("loginCallbackAdr");
      }

      this.getGift();

      this.isRegister = App.loginState();
      if (!this.isRegister) {
        return this.userAuth();
      }
      this.getUserData();
    },
    openDebug() {
      // #ifdef MP-WEIXIN
      let time = Date.parse(new Date());
      if (time - this.lastTime <= 1000) {
        this.debugCount++;
      } else {
        this.debugCount = 1;
      }
      this.lastTime = time;
      if (this.debugCount == 10) {
        uni.showModal({
          title: "提示",
          content: "是否切换调试模式？确定后需要重启",
          success: (res) => {
            if (res.confirm) {
              uni.setStorageSync("logDebug", App.logDebug ? false : true);
              uni.setEnableDebug({
                enableDebug: App.logDebug ? false : true,
              });
            }
          },
        });
      }
      // #endif
    },
    // 获取小程序码
    async getQrcode() {
      /**
       * &store_id => &s 门店id
       * &distributor_id => &d 分销员id
       * &share_uid => &su	分享人uid
       * &share_guide_id => &sg	导购员id
       * */
      App.sendRequest({
        url: "/Share/shareQrCode_v2",
        data: {
          path:
            "pages/store/store?s=" +
            this.$store.store_id +
            "&su=" +
            App.XcxData.userInfo.uid,
        },
        showLoading: true,
        success: async (res) => {
          if (res.status == 1) {
            let code = `data:image/jpg;base64,${res.data.qr_code}`;
            this.qrCode = await this.base64srcImg(code);
            // #ifdef MP-WEIXIN
            this.appletCode = this.qrCode;
            // #endif
            // #ifdef MP-ALIPAY
            this.appletCode = code;
            // #endif
          } else {
            uni.showToast({
              title: res.message,
              icon: "none",
            });
          }
        },
      });
    },

    base64srcImg(img) {
      return new Promise((resolve, reject) => {
        base64src(img, (filePath) => {
          console.log("filePath - base64Avatar", filePath);
          if (filePath) {
            resolve(filePath);
          } else {
            reject(false);
          }
        });
      });
    },

    onConfirmClick() {
      getApp().globalData.saveImg({
        url: this.appletCode,
      });
    },
    cancelModal() {
      this.$refs.modal.hideModal();
    },
    seeMessage() {
      uni.navigateTo({
        url: "/pages/distribution/message/message",
      });
    },
    //点击跳转到订单页
    toOrder(index) {
      uni.navigateTo({
        url: this.orderMenu[index].path,
      });
    },
    //查看全部订单
    toAllOrder() {
      uni.navigateTo({
        url:
          this.type == 1
            ? "/pages/mer/order/list/list"
            : "/pages/myOrder/myOrder",
      });
    },

    toOther(e) {
      var path = e.currentTarget.dataset.path;
      var type = e.currentTarget.dataset.type;
      switch (type) {
        case 1:
        case 2:
        case 3:
        case 4:
        case 5:
        case 7:
        case 9:
          uni.navigateTo({
            url: path,
          });
          break;
        case 8:
          let isDistribution = Number(this.info.distributor);
          let center = "/pages/distribution/center/center";
          let recruit = "/pages/distribution/recruit/recruit";
          let urlPath = isDistribution == 1 ? center : recruit; //{1:是,0不是}
          uni.navigateTo({
            url: urlPath,
          });
          break;
        case 10:
          // uni.navigateTo({
          // 	url:'/pages/mer/tabbar/invite/invite',
          // });

          // if (this.$refs.modal) {
          // 	this.$refs.modal.showModal(); // 显示

          // 	if (!this.appletCode) this.getQrcode();
          // } else {
          // 	uni.showToast({
          // 		title: '门店二维码生成错误',
          // 		icon: 'none'
          // 	})
          // }
          break;
        case 6:
          uni.navigateTo({
            url: "/pages/mer/tabbar/gift_purchase/gift_purchase",
          });
          console.log("?????????????????");
          break;
        case 11:
          uni.navigateTo({
            url: "/pages/mer/tabbar/invite/invite",
          });

          break;
        case 12:
          uni.navigateTo({
            url: "/pages/mer/tabbar/coupon/coupon?genre=" + 1,
          });

          break;

        case 13:
          uni.navigateTo({
            url: "/pages/mer/goods/details/contact",
          });

          break;
      }
    },
    //会员卡
    mycard() {
      uni.navigateTo({
        url: "/pages/mine/card/card",
      });
    },
    //供应商
    handlerToSupplier() {
      uni.navigateTo({
        url: "/pages/mer/tabbar/supplier/supplier",
      });
    },

    toRecharge(e) {
      return;
      let type = Number(e.currentTarget.dataset.type);
      type &&
        uni.navigateTo({
          url: "/pages/mine/recharge/recharge",
        });
    },
    //跳转至积分页面
    toIntegral(e) {
      this.isRegister &&
        uni.navigateTo({
          url: "/pages/mine/integralOrder/integralOrder",
        });
    },
    //跳转至优惠券页面
    toCoupon(e) {
      uni.navigateTo({
        url: "/pages/mine/mycoupon/mycoupon",
      });
    },
    //跳到礼品卡
    toGiftCard() {
      // uni.navigateTo({
      // 	url: '/pages/mine/gift_mycard/gift_mycard',
      // });

      uni.navigateTo({
        url: "/pages/mer/tabbar/my_gift_mycard/my_gift_mycard",
      });
    },
    //显示引导用户授权
    userAuth() {
      this.$nextTick(() => {
        this.$refs.loginRef.show();
      });
    },
    //登录成功
    loginSuccess() {
      this.isRegister = true;
      this.getUserData();
      this.getGift();
      setTimeout(() => {
        if (this.loginCallbackAdr) {
          uni.setStorageSync("loginCallbackAdr", this.loginCallbackAdr);
          App.loginCallback();
        }
      }, 1000);
    },
    async getUserData() {
      const re = await this.$request("SmallProgramApi/My/myShow_v1");
      if (re.status != 1) return;
      this.info = re.my_info;
      this.open_plus = re.open_plus ? re.open_plus : 0;
      this.open_turntable_task = re.open_turntable_task == 1 ? true : false;
      this.online_status = re.online_status;
      this.open_distribution = re.open_distribution;

      this.orderMenu.forEach((item, index) => {
        item.num = re.order_status[item.num_key];
      });
      let user = {
        ...App.XcxData.userInfo,
      };
      user.vid = re.my_info.vid;
      user.store_name = re.my_info.store_name;
      user.store_id = re.my_info.store_id;
      this.userInfo = user;
      App.XcxData.userInfo = {
        ...user,
      };
    },
    getGift() {
      App.sendRequest({
        url: "/My/merchantGift",
        type: "post",
        data: {},
        showLoading: false,
        success: (re) => {
          // console.log(re);
          if (re.status == 1) {
            this.setData({
              gift: 1,
            });
          }
        },
      });
    },
    //返回上一页面
    reBack() {
      uni.setStorageSync("loginCallbackAdr", this.loginCallbackAdr);
      App.loginCallback();
    },
  },
};
</script>
<style lang="scss">
@import "./personal-center.css";

.my-top-bg-icon {
  display: none;
  color: var(--primary-color);
  font-size: 750rpx;
  line-height: 750rpx;
  position: absolute;
  top: 124rpx;
  left: 0;
}

.empty-image {
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  box-sizing: border-box;

  .empty-image-icon {
    font-size: 72rpx;
    color: rgba(var(--primary-rgb-color), 0.3);
    line-height: 72rpx;
  }
}

.newMessage {
  position: relative;

  .message-icon {
    font-size: 50rpx;
    color: #ffffff;
  }

  .list-tip-text {
    background: #fff;
    color: var(--primary-color);
    right: -15rpx;
  }
}

.qr_class {
  width: 370rpx;
  text-align: center;

  image {
    width: 350rpx;
    height: 350rpx;
    margin-bottom: 20rpx;
  }
}

.wyb-class {
  position: absolute;
}
</style>
